import React from 'react';
import MenuList from '../components/MenuList';
import {connect} from 'dva';
import {Layout } from 'antd';
import Login　from '../routes/Login';
import Error from '../components/Error'
import Bread from '../components/Bread'
const { Header, Sider, Content } = Layout;

const HomePage = ({app,dispatch,children}) =>{
    const {locationPathname,menuList} = app
    if(locationPathname === '/login'){
        return (
            <Login />
        )
    }
    const isPath = menuList.findIndex((e)=>{
        return e.route == locationPathname;
    })
    if(isPath < 0){
        return (
            <Error />
        )
    }
    return(
        <Layout >
            <Header style={styles.headerBox}>
                <div style={styles.headerTextBox}>
                    <h1 style={styles.headerText}>Pjee</h1>
                </div>
            </Header>
            <Layout>
                <Sider>
                    <MenuList menuListData={menuList}/>
                </Sider>
                <Layout style={{ padding: '0 24px 24px' }}>
                    <Bread {...app}/>
                    <Content>
                        {
                            children
                        }
                    </Content>
                </Layout>
            </Layout>
        </Layout>
    )
}

const styles = {
    headerBox:{
        height:50,
        padding:0
    },
    headerTextBox:{
        height:50,
        width:200,
        textAlign:'center',
    },
    headerText:{
        color:'#fff',
    }
}
export default connect(({app})=>({app}))(HomePage);
